@import "boot.css";
body,html{
    font-size: 16px;
    background-color: #f2f2f2;
}
.tabbar{
    position: relative;
    height: 49px;
}
.tabbar .bar{
    position: fixed;
    width: 100%;
    height: 49px;
    border-top: 1px #e7e7e7 solid;
    bottom: 0;
    background-color: #fff;
    display: flex;
    z-index: 1000;
}

.tabbar .bar .item{
    flex: 1;
    width: 25%;
    min-width: 25%;
    max-width: 25%;
    padding: 5px 0 0;
}

.tabbar .bar .item .item-icon{
    height: 20px;
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    display: block;
}

.tabbar .bar .item .item-title{
    text-align: center;
    font-size: 14px;
}

.tabbar .bar .item .item-title-active{
    color: #6CD07E;
}

.tabbar .bar .item .item-home{
    background-image: url("../images/mobile/tabbar/home.png");
}

.tabbar .bar .item .item-home-active{
    background-image: url("../images/mobile/tabbar/home-fill.png");
}

.tabbar .bar .item .item-so{
    background-image: url("../images/mobile/tabbar/catlog.png");
}

.tabbar .bar .item .item-so-active{
    background-image: url("../images/mobile/tabbar/catlog-fill.png");
}

.tabbar .bar .item .item-cart{
    background-image: url("../images/mobile/tabbar/cart.png");
}

.tabbar .bar .item .item-cart-active{
    background-image: url("../images/mobile/tabbar/cart-fill.png");
}

.tabbar .bar .item .item-mine{
    background-image: url("../images/mobile/tabbar/my.png");
}

.tabbar .bar .item .item-mine-active{
    background-image: url("../images/mobile/tabbar/my-fill.png");
}

.app{
    display: block;
    overflow: hidden;
}

.global-menus{
    display: block;
    background-color: #fff;
}

.global-menus .wrapper{
    margin: -1px;
    display: flex;
    flex-direction: row;
    flex-flow: wrap;
    padding: 10px 0;
}

.global-menus .wrapper li{
    flex: 1;
    width: 25%;
    min-width: 25%;
    max-width: 25%;
    padding: 10px 0;
}

.global-menus .wrapper li .image{
    text-align: center;
    display: block;
}

.global-menus .wrapper li .image img{
    width: 40px;
    height: 40px;
    border-radius: 20px;
}

.global-menus .wrapper li .title{
    text-align: center;
    font-size: 14px;
    color: #222;
    display: block;
    margin-top: 3px;
}

.banner{
    display: block;
}

.banner img{
    width: 100%;
    display: block;
}

.title-banner{
    display: block;
    height: 50px;
    background-position: center center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    padding-top: 5px;
    clear: both;
}

.content-div{
    display: block;
    background-color: #fff;
}

.title-div{
    display: block;
    padding: 10px;
    font-size: 18px;
    color: #222;
    font-weight: 500;
    border-bottom: 1px #e9e9e9 solid;
}

.more-div{
    display: block;
}

.more-div a,.more-div span{
    display: block;
    padding: 15px;
    text-align: center;
    color: #00a2d4;
    font-size: 15px;
}

.chaozhi{
    display: flex;
    flex-direction: row;
}

.chaozhi .item{
    width: 33.33%;
    margin: 0 5px;
    background-color: #fff;
}

.chaozhi .item .image{
    padding-top: 100%;
    border-radius: 3px;
}

.chaozhi .item .title{
    font-size: 12px;
    font-weight: 300;
    padding:0 5px;
    line-height: 14px;
    height: 28px;
    overflow: hidden;
    margin: 5px 0;
}

.chaozhi .item .price{
    font-size: 14px;
    color: #f00;
    padding-bottom: 7px;
}

.jingxuan{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.jingxuan .item{
    width: 50%;
    max-width: 50%;
    padding-top: 30%;
    display: block;
    background-size: 100% 100%;
}

.item-grid-list{
    padding: 5px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.item-grid-list li{
    width: 50%;
    margin-bottom: 10px;
    overflow: hidden;
    display: block;
}

.item-grid-list li .hd{
    display: block;
    margin: 0 5px;
    background-color: #fff;
    border-radius: 2px;
}

.item-grid-list li .image{
    padding-top: 100%;
    display: block;
    border-radius: 2px;
}

.item-grid-list li .title{
    display: block;
    margin: 7px 0;
    font-size: 14px;
    font-weight: 300;
    line-height: 16px;
    height: 32px;
    overflow: hidden;
    padding: 0 5px;
}

.item-grid-list li .data{
    display: flex;
    padding: 5px;
}

.item-grid-list li .data strong{
    flex: 1;
    font-size: 16px;
    color: #FF0000;
    font-weight: 500;
    line-height: 1;
}

.item-grid-list li .data span{
    font-size: 12px;
    color: #888;
    font-weight: 300;
    line-height: 16px;
}

.article-list{
    display: block;
    padding: 0 10px;
}

.article-list li{
    display: flex;
    padding: 15px 0;
    border-bottom: 1px #e5e5e5 solid;
}

.article-list li .image{
    flex: 1;
    width: 100px;
    min-width: 100px;
    max-width: 100px;
    height: 80px;
    display: block;
    margin-right: 10px;
    border-radius: 2px;
}

.article-list li .data{
    flex: 1;
    height: 80px;
    position: relative;
}

.article-list li .data .title{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    display: block;
    margin-bottom: 7px;
    color: #222;
}

.article-list li .data .info{
    color: #888;
    font-size: 12px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.article-list li .data .info span{
    margin-right: 10px;
}

.article-list li .data .created_at{
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 13px;
    color: #888;
}

/*===新闻正文===*/
.articel-detail{
    display: block; overflow: hidden;
    background-color: #f8f8f8;
}

.articel-detail .head{
    background-color: #fff;
    padding: 20px 15px 10px;
    display: block;
}

.articel-detail .head h1{
    font-size: 22px;
    font-weight: 600;
    line-height: 1.2;
    display: block;
    color: #333;
    margin-bottom: 10px;
    text-align: justify;
}

.articel-detail .head p{
    color: #888; font-size: 12px;
    display: block;
}

.articel-detail .body{
    display: block;
    padding: 15px;
    background-color: #f8f8f8;
}

.articel-detail .body .content{
    font-size: 18px; color: #333;
    line-height: 1.5; text-align: justify;
}

.articel-detail .body .content *{max-width: 100%;}

.articel-detail .body .media{
    display: block;
    padding-top: 70%;
    position: relative;
}

.articel-detail .body .media .iframe, .news-detail .body .media .video{
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    z-index: 10;
    background-color: #333;
}

.articel-detail .body .media .play-btn{
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    z-index: 20;
}

.articel-detail .body .image-list{
    display: block;
}

.articel-detail .body .image-list img{
    max-width: 100%; margin-bottom: 10px;
}

.articel-detail .qrcode{
    display: block;
    text-align: center;
    padding: 20px;
}

.articel-detail .qrcode .qr img{
    width: 140px; height: 140px;
    display: block; margin: 0 auto;
}

.articel-detail .qrcode p{
    text-align: center;
    font-size: 16px; margin-top: 10px;
    color: #666;
}

.articel-detail .share{
    display: block;
    padding: 20px 0;
}

.articel-detail .share .line{
    height: 0; display: block;
    clear: both; border-bottom: 1px #DDD solid;
    position: relative;
}

.articel-detail .share .text{
    position: absolute;
    height: 20px;
    width: 100px;
    text-align: center;
    background-color: #f8f8f8;
    display: block;
    left: 50%;
    top: -10px;
    margin-left: -50px;
    font-size: 12px;
    color: #777;
}

.articel-detail .share .item-list{
    display: inline-flex; flex-flow: row nowrap;
    width: 100%; margin-top: 30px;
}

.articel-detail .share .item-list li{
    flex: 1;
    text-align: center;
    width: 25%;
    min-width: 25%;
    max-width: 25%;
}

.articel-detail .share .item-list li .ico{
    width: 40px; height: 40px; display: block; margin: 0 auto 5px auto;
}

.articel-detail .share .item-list li .title{
    font-size: 14px; color: #777; display: block; text-align: center;
}


.comment{
    display: block;
    overflow: hidden;
    background-color: #f8f8f8;
}

.comment .title{
    display: block;
    padding: 10px 15px;
    border-bottom: 1px #e7e7e7 solid;
}

.comment .title span{
    background-color: #FE4456;
    font-size: 12px;
    color: #fff;
    display: inline-block;
    padding: 3px 10px;
    border-radius: 5px;
}

.comment .listview{
    display: block;
}

.comment .listview .item{
    display: flex;
    flex-flow: row nowrap;
    border-bottom: 1px #e7e7e7 solid;
    padding: 15px;
    width: 100%;
}

.comment .listview .item .avatar{
    width: 40px;
    height: 40px;
    display: block;
    border-radius: 50%;
    margin-right: 10px;
    flex: 1;
    min-width: 40px;
    max-width: 40px;
}

.comment .listview .item .content{
    flex: 1;
    display: block;
    position: relative;
}

.comment .listview .item .likes{
    position: absolute;
    right: 0;
    top: 0;
    font-size: 13px;
    color: #999;
}

.comment .listview .item .likes span{
    margin-right: 4px; font-size: 14px;
}

.comment .listview .item .likes i{
    font-size: 13px; font-style: normal;
}

.comment .listview .item .username{
    font-size: 14px; color: #777;
    display: block; line-height: 1.0;
}

.comment .listview .item .location{
    font-size: 12px;
    color: #999;
    padding: 3px 0;
}

.comment .listview .item .location span{
    margin-right: 5px;
}

.comment .listview .item .message{
    font-size: 16px;
    color: #333;
    line-height: 1.3;
    text-align: justify;
}

.comment .listview .title{
    background-color: #e2e2e2;
    font-size: 14px; padding: 0 5px;
    height: 28px; line-height: 28px; display: block;
    overflow: hidden; color: #666; margin-top: 5px;
    border-radius: 2px;
}

.comment .nocomment{
    display: block; padding: 100px 0;
}

.comment .nocomment .icon{
    background-image: url("../images/mobile/soufa.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    width: 80px; height: 80px;
    display: block; margin: 0 auto;
}

.comment .nocomment p{
    color: #9999;
    font-size: 16px;
    text-align: center;
    padding-top: 5px;
}

.feedback{
    display: block;
    padding: 20px 10px;
    background-color: #fff;
}

.feedback .form-wrap .form-group .label{
    width: 40px;
    min-width: 40px;
    max-width: 40px;
}

.feedback .form-wrap .form-group .textarea{
    height: 160px;
}

/*底部*/
.bottom-bar{
    height: 46px;
    position: relative;
    display: block;
}

.bottom-bar .fixed{
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 46px;
}

.bottom-bar .btn{
    display: block;
    background-color: #FF0000;
    height: 46px;
    line-height: 46px;
    text-align: center;
    color: #fff;
    font-size: 16px;
}

/*搜索*/
.search-sidebar{
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: 90px;
    padding: 8px 0;
    display: block;
    background-color: #e5e5e5;
}

.search-sidebar ul{
    display: block;
}

.search-sidebar ul li{

}

.search-sidebar ul li a{
    display: block;
    text-align: center;
    padding: 8px 0;
    font-size: 14px;
}

.search-main{
    display: block;
    margin-left: 90px;
    overflow: hidden;
}

.search-main .title{
    padding: 20px;
    font-size: 16px;
    text-align: center;
    display: block;
}

.search-main .catlogs{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.search-main .catlogs li{
    width: 33.33%;
    text-align: center;
}

.search-main .catlogs li .icon{
    text-align: center;
}

.search-main .catlogs li .icon img{
    width: 50px;
    height: 50px;
    display: inline-block;
}

.search-main .catlogs li .subtitle{
    font-size: 14px;
    text-align: center;
    line-height: 1;
    display: block;
    margin-top: 8px;
}

/*购物车*/
.cart{
    display: block;
}

.cart .shop-item{
    display: block;
    background-color: #fff;
    margin-bottom: 10px;
}

.cart .shop-item .shop{
    display: flex;
    border-bottom: 1px #e5e5e5 solid;
}

.cart .shop-item .shop .shop-name{
    font-size: 14px;
    padding: 10px 0;
    flex: 1;
    line-height: 1;
}

.cart .shop-item .checkwrap{
    width: 40px;
    align-self: center;
    align-content: center;
    text-align: center;
}

.cart .shop-item .items{
    display: block;
    padding: 5px 0;
}

.cart .shop-item .items .item{
    display: flex;
    padding: 5px 10px 5px 0;
}

.cart .shop-item .items .image{
    width: 80px;
    height: 80px;
    border-radius: 3px;
    margin-right: 10px;
}

.cart .shop-item .items .content{
    flex: 1;
    height: 80px;
    display: flex;
    flex-direction: column;
}

.cart .shop-item .items .content .title{
    font-size: 14px;
    line-height: 1.2;
}

.cart .shop-item .items .content .flex{
    flex: 1;
}

.cart .shop-item .items .content .bot{
    display: flex;
    flex-direction: row;
}

.cart .shop-item .items .content .price{
    font-weight: 500;
    font-size: 16px;
    color: #f00;
    flex: 1;
}

.cart .shop-item .items .quantity-box{
    border-radius: 3px;
    border: 1px #e2e2e2 solid;
    height: 30px;
    display: flex;
    flex-direction: row;
    overflow: hidden;
}

.cart .shop-item .items .quantity-box .button{
    width: 40px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #000;
    font-size: 15px;
    border: 0;
}

.cart .shop-item .items .quantity-box .text{
    width: 50px;
    border: 0;
    height: 30px;
    background: none;
    font-size: 14px;
    text-align: center;
    border-left: 1px #e2e2e2 solid;
    border-right: 1px #e2e2e2 solid;
    border-radius: 0;
}

.cart .maylike{
    display: block;
    padding: 20px;
    font-size: 16px;
    text-align: center;
}

/*商品详情*/
.item-info{
    background-color: #fff;
    display: block;
    padding: 10px;
    margin-bottom: 10px;
}

.item-info .price{
    display: flex;
    color: #ff4400;
}

.item-info .price span{
    font-size: 14px;
    padding-top: 2px;
    display: block;
}

.item-info .price strong{
    font-size: 16px;
}

.item-info .title{
    font-size: 16px;
    font-weight: 400;
    color: #000;
    line-height: 1.2;
    display: block;
    margin: 7px 0;
}

.item-info .subtitle{
    color: #777;
    font-size: 14px;
    display: block;
}

.item-info .data{
    display: flex;
    flex-direction: row;
    font-size: 12px;
    color: #777;
    margin-top: 20px;
}

.item-info .data .text{
    flex: 1;
    line-height: 1;
}

.section-title{
    padding: 15px;
    font-size: 16px;
    line-height: 1;
    text-align: center;
    display: block;
}

.shop-info{
    display: block;
    background-color: #fff;
    padding: 10px;
}

.shop-info .info{
    display: flex;
    flex-direction: row;
}

.shop-info .info .logo{
    width: 50px;
    height: 50px;
    border-radius: 25px;
    margin-right: 10px;
}

.shop-info .info .name{
    flex: 1;
}

.shop-info .info .name h3{
    font-size: 16px;
    font-weight: 400;
    color: #000;
    display: block;
    margin-bottom: 5px;
    padding-top: 5px;
    line-height: 1;
}

.shop-info .info .name p{
    color: #777;
    font-size: 13px;
}

.shop-info .data{
    display: flex;
    flex-direction: row;
    margin: 10px 0;
}

.shop-info .data .item{
    padding: 5px 0;
    text-align: center;
    color: #777;
    font-size: 14px;
    border-left: 1px #e5e5e5 solid;
    flex: 1;
}

.shop-info .data .item .p{
    padding: 3px 0;
    line-height: 1;
}

.shop-info .visit{
    display: block;
    text-align: center;
}

.shop-info .visit .button{
    display: inline-block;
    padding: 7px 15px;
    border: 1px #f00 solid;
    line-height: 1;
    font-size: 14px;
    color: #f00;
    border-radius: 6px;
}

.item-content{
    display: block;
    background-color: #fff;
}

.item-content *{
    max-width: 100%;
}

.item-min-actions{
    width: 40%;
    display: flex;
    padding: 0 5px;
}

.item-min-actions .action{
    flex: 1;
    text-align: center;
    padding-top: 3px;
}

.item-min-actions .action .i{
    width: 25px;
    height: 25px;
    display: inline-block;
}
.item-min-actions .action .t{
    font-size: 12px;
    text-align: center;
    color: #666;
}

.item-auction-button{
    flex: 1;
    text-align: center;
    background-color: #FB933A;
    font-size: 16px;
    color: #fff;
    line-height: 49px;
}

.item-listview{
    display: block;
    background-color: #fff;
}

.item-listview li{
    display: flex;
    padding: 10px;
    border-bottom: 1px #e5e5e5 solid;
}

.item-listview li .image{
    width: 120px;
    height: 100px;
    margin-right: 10px;
    border-radius: 3px;
}

.item-listview li .content{
    flex: 1;
    height: 100px;
    display: flex;
    flex-direction: column;
}

.item-listview li .title{
    font-size: 16px;
    line-height: 18px;
    height: 36px;
    overflow: hidden;
    display: block;
}

.item-listview li .flex{
    flex: 1;
}

.item-listview li .price{
    display: flex;
}

.item-listview li .price strong{
    color: #f40;
    font-size: 16px;
    margin-right: 5px;
    display: block;
    line-height: 20px;
}

.item-listview li .price span{
    flex: 1;
    display: block;
    line-height: 20px;
    font-size: 14px;
    color: #777;
}

.item-listview li .location{
    height: 18px;
    line-height: 18px;
    overflow: hidden;
    display: flex;
    color: #777;
    font-size: 12px;
    margin-top: 5px;
}

.item-listview li .location .seller{
    flex: 1;
    margin-right: 10px;
}

/**/
.buybox{
    background-color: #fff;
    position: fixed;
    z-index: 99999;
    left: 0;
    right: 0;
    bottom: -100%;
}

.buybox .content{
    display: block;
    position: relative;
    padding: 10px 0 20px;
}

.buybox .content .close{
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 40px;
    line-height: 1;
    color: #000;
}

.buybox .content .item-info{
    display: flex;
    flex-direction: row;
    padding: 10px;
    border-bottom: 1px #e5e5e5 solid;
}

.buybox .content .item-info .image{
    width: 80px;
    height: 80px;
    border-radius: 4px;
    display: block;
    margin-right: 10px;
}

.buybox .content .item-info .con{
    flex: 1;
    height: 80px;
    display: flex;
    flex-direction: column;
    padding: 0;
    margin-right: 50px;
}

.buybox .content .item-info .title{
    font-size: 14px;
    padding: 0;
    line-height: 1.2;
    margin: 0;
}

.buybox .content .item-info .price{
    font-size: 16px;
    color: #ff0000;
    line-height: 1;
}

.buybox .content .item-info .stock{
    color: #666;
    font-size: 14px;
    display: block;
    margin-top: 5px;
    line-height: 1;
}

.buybox .content .item-info .flex{
    flex: 1;
}

.buybox .content .actions{
    display: block;
    padding: 10px;
}

.buybox .content .actions .group{
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
}

.buybox .content .actions .group .cell-left{
    align-self: center;
    align-content: center;
    flex: 1;
    font-size: 14px;
}

.buybox .content .actions .group .cell-right{

}

.buybox .content .actions .quantity-box{
    display: flex;
    flex-direction: row;
    background-color: #F2F2F2;
}

.buybox .content .actions .quantity-box .button{
    width: 40px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    display: inline-block;
    font-size: 14px;
}

.buybox .content .actions .quantity-box .text{
    border: 0;
    background:none;
    width: 60px;
    height: 30px;
    text-align: center;
    font-size: 14px;
    border-left: 1px #fff solid;
    border-right: 1px #fff solid;
}

.buybox .content .actions .submit-btn{
    background-color: #f00;
    text-align: center;
    font-size: 16px;
    color: #fff;
    padding: 10px 0;
    border-radius: 20px;
    display: block;
    margin-top: 30px;
    border: 0;
    width: 100%;
}


/*门店*/
.shopview{
    background-color: #f2f2f2;
    display: block;
}
.shop-header{
    background-color: #2FC361;
    color: #fff;
    position: relative;
    margin-bottom: 10px;
}

.shop-header .info{
    padding: 10px;
    display: flex;
    flex-direction: row;
}

.shop-header .info .logo {
    width: 50px;
    height: 50px;
    display: block;
    margin-right: 10px;
    border-radius: 8px;
}

.shop-header .info .data{
    flex: 1;
    height: 50px;
}

.shop-header .info .data h4{
    font-size: 18px;
    padding: 7px 0;
    line-height: 1;
    font-weight: 400;
}

.shop-header .info .data p{
    font-size: 12px;
    line-height: 1;
}
.shop-header .info .data p span{
    margin-right: 10px;
}

.shop-header .tabs{
    display: flex;
    background-color: #fff;
    height: 50px;
    position: relative;
    border-bottom: 1px #e5e5e5 solid;
}

.shop-header .tabs li{
    flex: 1;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    color: #222;
}

.shop-header .tabs li.active{
    border-bottom: 2px #2FC361 solid;
    color: #2FC361;
    margin-bottom: -1px;
}

/*buynow*/
.buynow{
    display: block;
    background-color: #F2F2F2;
}

.buynow .order-info{
    display: block;
    background-color: #fff;
}

.buynow .order-info .shop-name{
    padding: 15px 10px;
    font-size: 16px;
    line-height: 1;
    border-bottom: 1px #e5e5e5 solid;
}

.buynow .order-info .item-info{
    padding: 10px;
    display: flex;
    border-bottom: 1px #e5e5e5 solid;
    margin: 0;
}

.buynow .order-info .image{
    width: 100px;
    height: 80px;
    border-radius: 3px;
    margin-right: 10px;
}

.buynow .order-info .data{
    flex: 1;
    height: 80px;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
}

.buynow .order-info .title{
    font-size: 14px;
    line-height: 1.2;
    margin: 0;
    padding: 0;
}

.buynow .order-info .flex{
    flex: 1;
}

.buynow .order-info .price{
    display: flex;
    flex-direction: row;
}

.buynow .order-info .price strong{
    font-size: 16px;
    color: #f40;
    flex: 1;
    display: block;
}

.buynow .order-info .price span{
    font-size: 14px;
    display: block;
    color: #000;
}

.buynow .row{
    display: flex;
    padding: 10px;
    border-bottom: 1px #e5e5e5 solid;
    margin: 0;
}

.buynow .row .cell-left{
    flex: 1;
    font-size: 16px;
}

.buynow .row .cell-right{
    color: #777;
    font-size: 14px;
}

.buynow .row .textarea{
    width: 100%;
    height: 80%;
    border: 0;
    background: none;
    font-size: 14px;
}

.buynow .address{
    display: flex;
    padding: 15px 10px;
    background-color: #fff;
    margin-bottom: 10px;
    flex-direction: row;
}

.buynow .address .iconfont{
    font-size: 36px;
    margin-right: 5px;
    line-height: 1;
    color: #666;
    padding-top: 5px;
}

.buynow .address .info{
    flex: 1;
}

.buynow .address .info p{
    padding: 5px 0;
    font-size: 14px;
    line-height: 1;
}

.tabbar .order-fee{
    flex: 1;
    display: block;
    text-align: right;
    padding: 16px 15px;
    font-size: 16px;
    line-height: 1;
}

.tabbar .order-fee strong{
    color: #f00;
}

.tabbar .settlement{
    background-color: #ff0000;
    color: #fff;
    text-align: center;
    align-content: center;
    align-items: center;
    align-self: center;
    display: block;
    padding: 16px 30px;
    height: 49px;
    line-height: 1;
    font-size: 16px;
}

.order-detail{
    display: block;
    background-color: #F2F2F2;
}

.order-detail .order-header{
    background-color: #2FC361;
    padding: 20px;
    color: #fff;
    display: flex;
}

.order-detail .order-status{
    align-self: center;
    align-items: center;
    align-content: center;
    flex: 1;
}

.order-detail .order-status strong{
    font-size: 20px;
}

.order-detail .order-header .status-icon{
    width: 50px;
    height: 50px;
    display: block;
}

.order-detail .address{
    display: flex;
    padding: 15px 10px;
    background-color: #fff;
    margin-bottom: 10px;
    flex-direction: row;
}

.order-detail .address .iconfont{
    font-size: 36px;
    margin-right: 5px;
    line-height: 1;
    color: #666;
    padding-top: 5px;
}

.order-detail .address .info{
    flex: 1;
}

.order-detail .address .info p{
    padding: 5px 0;
    font-size: 14px;
    line-height: 1;
}

.order-detail .order-info{
    background-color: #fff;
    display: block;
}
.order-detail .order-info .shop-name{
    font-size: 16px;
    padding: 15px 10px;
    line-height: 1;
}

.order-detail .items{
    background-color: #F8F8F8;
    display: block;
    padding: 5px 0;
}

.order-detail .items .item{
    display: flex;
    padding: 10px;
}

.order-detail .items .item .image{
    width: 80px;
    height: 80px;
    display: block;
    border-radius: 3px;
    margin-right: 10px;
}

.order-detail .items .item .name{
    height: 80px;
    margin-left: 10px;
    margin-right: 10px;
    display: block;
    flex: 1;
}

.order-detail .items .item .name h3{
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
}

.order-detail .items .item .attrs{
    width: 80px;
    text-align: right;
}

.order-detail .items .item .attrs p{
    font-size: 14px;
    line-height: 1;
    display: block;
    margin-bottom: 6px;
    text-align: right;
}

.order-detail .groups{
    display: block;
    padding: 5px 0;
}

.order-detail .group{
    display: flex;
    flex-direction: row;
    padding: 5px 10px;
}

.order-detail .group .label-name{
    font-size: 16px;
    line-height: 1;
    flex: 1;
}

.order-detail .group .label-text{
    font-size: 14px;
    color: #777;
    line-height: 16px;
}

.order-detail .trade-info{
    display: block;
    padding: 5px 0;
    margin: 10px 0;
    background-color: #fff;
}

.order-detail .trade-info li{
    color: #666;
    font-size: 14px;
    padding: 3px 10px;
    line-height: 1;
}

.order-detail .pay{
    display: block;
    margin: 20px;
}

.order-detail .pay .button{
    background-color: #2FC361;
    color: #fff;
    padding: 15px;
    text-align: center;
    display: block;
    border: 0;
    border-radius: 10px;
    font-size: 16px;
    line-height: 1;
}


/*用户中心*/
.userview{
    display: block;
}

.userview .header{
    padding: 30px 10px;
    background-color: #2FC361;
    color: #fff;
    display: flex;
    flex-direction: row;
}

.userview .header .avatar{
    width: 64px;
    height: 64px;
    border-radius: 32px;
    border: 3px #fff solid;
    display: block;
    margin-right: 10px;
}

.userview .header .info{
    flex: 1;
    height: 64px;
    align-self: center;
    align-content: center;
    align-items: center;
    padding-top: 20px;
}

.userview .header .info strong{
    font-size: 22px;
    line-height: 1;
}

.userview .order-actions{
    display: block;
    background-color: #fff;
}

.userview .order-actions .actions{
    display: flex;
    padding: 13px 0;
    border-bottom: 1px #e7e7e7 solid;
}

.userview .order-actions .actions li{
    flex: 1;
    text-align: center;
}

.userview .order-actions .actions .ico{
    width: 30px;
    height: 30px;
    display: inline-block;
}

.userview .order-actions .actions .txt{
    font-size: 12px;
    color: #666;
    text-align: center;
    display: block;
    margin-top: 2px;
}

.userview .metas{
    display: block;
    background-color: #fff;
    margin-top: 10px;
    border-top: 1px #e7e7e7;
}


.tablerow{
    padding: 13px 12px;
    display: flex;
    flex-direction: row;
    border-bottom: 1px #e5e5e5 solid;
}

.tablerow .icon{
    width: 25px;
    height: 25px;
    margin-right: 10px;
    display: block;
}

.tablerow .textlabel{
    font-size: 16px;
    flex: 1;
    line-height: 25px;
    margin-right: 20px;
}

.tablerow .detaillable{
    font-size: 14px;
    line-height: 25px;
    color: #777;
    text-align: right;
}

.tablerow .arrow{
    display: block;
    background-image: url("../images/common/right.png");
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: center center;
    width: 16px;
    height: 25px;
    margin-left: 10px;
}

/*已买到的订单*/
.order-status-tabs{
    padding: 0;
    display: flex;
    border-bottom: 1px #e5e5e5 solid;
    position: relative;
    background-color: #fff;
}

.order-status-tabs li{
    flex: 1;
    font-size: 14px;
    text-align: center;
    padding: 13px 0;
}

.order-status-tabs li.active{
    font-weight: bold;
    color: #ff0000;
    border-bottom: 2px #ff0000 solid;
    margin-bottom: -1px;
}

.bought{
    display: block;
}

.bought .order-item{
    display: block;
    background-color: #fff;
    margin-bottom: 10px;
}

.bought .order-item .shop{
    padding: 10px;
    display: flex;
}

.bought .order-item .shop .shop-name{
    font-size: 14px;
    line-height: 1;
    padding-top: 5px;
    flex: 1;
    margin-right: 10px;
}

.bought .order-item .trade-status{
    color: #f00;
    font-size: 14px;
}

.bought .order-item .items{
    background-color: #f5f5f5;
    padding: 5px 0;
    display: block;
}

.bought .order-item .items .item{
    display: flex;
    padding: 5px 10px;
}

.bought .order-item .items .image{
    width: 80px;
    height: 80px;
    display: block;
    margin-right: 10px;
    border-radius: 3px;
}

.bought .order-item .items .content{
    flex: 1;
    height: 80px;
}

.bought .order-item .items .content h3{
    font-size: 14px;
    line-height: 1.2;
    font-weight: 400;
}

.bought .order-item .items .right{
    margin-left: 10px;
    text-align: right;
}

.bought .order-item .items .right p{
    display: block;
    font-size: 14px;
    margin-bottom: 7px;
    text-align: right;
}

.bought .order-item .simple{
    padding: 10px;
    font-size: 14px;
    display: block;
    border-bottom: 1px #e7e7e7 solid;
    text-align: right;
}

.bought .order-item .bottom{
    padding: 10px;
    display: flex;
    align-items: flex-end;
    align-self: flex-end;
    align-content: flex-end;
}

.bought .order-item .bottom .flex{
    flex: 1;
}

.bought .order-item .action-btn{
    padding: 7px 15px;
    border-radius: 20px;
    border: 1px #e5e5e5 solid;
    font-size: 12px;
    line-height: 1;
    display: block;
    margin-left: 10px;
}


.pay-success{
    display: block;
}

.pay-success .trade-info{
    background-color: #fff;
    padding: 30px;
    display: block;
    text-align: center;
}

.pay-success .trade-info .image{
    width: 50px;
    height: 50px;
    display: inline-block;
}

.pay-success .trade-info .status{
    font-size: 18px;
    text-align: center;
    color: #2FC361;
    font-weight: bold;
    display: block;
    margin: 10px 0;
}

.pay-success .trade-info .amount{
    display: block;
    margin-top: 10px;
    text-align: center;
    font-size: 28px;
    font-weight: 500;
}

.pay-success .complete{
    display: block;
    padding: 30px 20px;
}

.pay-success .complete .button{
    background-color: #2FC361;
    color: #fff;
    padding: 15px 0;
    width: 100%;
    display: block;
    text-align: center;
    font-size: 16px;
    border-radius: 10px;
    border: 0;
}

.tabbar .button-lg{
    padding: 10px;
    background-color: #ff0000;
    color: #fff;
    font-size: 16px;
    text-align: center;
    width: 100%;
    border: 0;
    border-radius: 20px;
    margin: 5px 10px;
}

/*添加新地址*/
.new-address{
    position: fixed;
    z-index: 1000;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: #fff;
}

.new-address .content{
    display: block;
    position: relative;
    height: 100%;
    overflow: auto;
}

.flex{
    flex: 1;
}

.new-address .titlebar{
    padding: 15px 10px;
    display: flex;
    font-size: 16px;
    border-bottom: 1px #e5e5e5 solid;
    flex-direction: row;
    line-height: 22px;
}

.new-address .titlebar .iconfont{
    font-size: 22px;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.new-address .address-form{
    display: block;
}

.new-address .address-form .group-name{
    width: 80px;
    font-size: 16px;
    margin-right: 10px;
    height: 30px;
    line-height: 30px;
}

.new-address .address-form .group-input{
    flex: 1;
}

.new-address .address-form .text{
    border: 0;
    height: 30px;
    width: 100%;
    background: none;
    display: block;
    font-size: 16px;
}

.new-address .address-form .save-button{
    display: block;
    padding: 20px;
}

.new-address .address-form .save-button button{
    padding: 10px;
    background-color: #ff0000;
    color: #fff;
    font-size: 16px;
    text-align: center;
    width: 100%;
    border: 0;
    border-radius: 20px;
}

.address-list{
    display: block;
}

.address-list .address-item{
    display: block;
    background-color: #fff;
    margin-bottom: 10px;
    border-top: 1px #efefef solid;
}

.address-list .address-item .info{
    display: block;
    padding: 15px 12px;
    border-bottom: 1px #e7e7e7 solid;
}

.address-list .address-item .consignee{
    display: flex;
    font-weight: 500;
}

.address-list .address-item .name{
    flex: 1;
    font-size: 16px;
}

.address-list .address-item .phone{
    font-size: 16px;
}

.address-list .address-item .addr{
    display: block;
    margin-top: 5px;
    font-size: 14px;
}

.address-list .address-item .actions{
    padding: 10px 12px;
    display: flex;
}

.address-list .address-item .actions .setdefault{
    flex: 1;
}

.address-list .address-item .actions .buttons{
    display: flex;
}

.shop-list{
    display: block;
    padding: 10px;
    background-color: #F2F2F2;
}

.shop-list .shop-item{
    display: block;
    background-color: #fff;
    border-radius: 3px;
    margin-bottom: 10px;
    padding: 10px;
}

.shop-list .shop-item .info{
    display: flex;
    flex-direction: row;
}
.shop-list .shop-item .logo{
    width: 40px;
    height: 40px;
    border-radius: 5px;
    overflow: hidden;
}

.shop-list .shop-item .name{
    margin: 0 10px;
    display: block;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    flex: 1;
}

.shop-list .shop-item .action{
    padding-top: 3px;
}

.shop-list .shop-item .button{
    padding: 7px 15px;
    line-height: 1;
    color: #f00;
    border: 1px #f00 solid;
    border-radius: 10px;
    font-size: 12px;
}

.shop-list .shop-item .items{
    display: flex;
    margin: 5px -5px;
}

.shop-list .shop-item .items .item{
    flex: 1;
    margin-right: 5px;
}

.shop-list .shop-item .items .item .bg{
    padding-top: 100%;
    border-radius: 3px;
    overflow: hidden;
}

.brands{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #fff;
}

.brands .item{
    min-width: 25%;
    max-width: 25%;
}

.brands .item .bg{
    padding-top: 100%;
}

.fupin-list{
    display: block;
}

.fupin-list .item-info{
    background-color: #fff;
    padding: 10px;
    margin-bottom: 10px;
}

.fupin-list .item-info .image{
    padding-top: 60%;
    display: block;
}

.fupin-list .item-info .title{
    padding: 5px 0;
    font-size: 15px;
    line-height: 1.2;
}

.fupin-list .item-info .data{
    display: flex;
    flex-direction: row;
}

.fupin-list .item-info .data .price{
    color: #f00;
    font-size: 16px;
    flex: 1;
}

.fupin-list .item-info .data .sold{
    font-size: 12px;
    color: #777;
}

/*店铺简介*/
.shop-profile{
    display: block;
}

.shop-profile .head{
    padding: 15px;
    background-color: #fff;
    margin-bottom: 10px;
    display: flex;
    flex-direction: row;
}

.shop-profile .head .logo{
    width: 50px;
    height: 50px;
    border-radius: 5px;
    margin-right: 20px;
}

.shop-profile .head .info{
    flex: 1;
    height: 50px;
    padding-top: 5px;
}

.shop-profile .head h3{
    font-size: 16px;
}

.shop-profile .head p{
    font-size: 14px;
    display: block;
    margin-top: 5px;
    color: #777;
}

.shop-profile .data{
    background-color: #fff;
    display: block;
    padding: 5px;
}

.shop-profile .data .label-name{
    width: 60px;
    margin-right: 20px;
    font-size: 14px;
}

.shop-profile .data .label-text{
    font-size: 14px;
    flex: 1;
    line-height: 1.2;
}

/*我的收藏*/
.collect{
    display: block;
}

.collect .tabs{
    display: flex;
    border-bottom: 1px #e9e9e9 solid;
    position: relative;
}

.collect .tabs li{
    flex: 1;
    padding: 15px 0;
    text-align: center;
    font-size: 14px;
}

.collect .tabs .active{
    color: #2FC361;
    border-bottom: 2px #2FC361 solid;
    margin-bottom: -1px;
}

.collect .item-list{
    display: block;
    background-color: #fff;
}

.collect .item-list .item{
    display: flex;
    padding: 15px;
    border-bottom: 1px #e5e5e5 solid;
}

.collect .item-list .item .image{
    width: 80px;
    height: 80px;
    border-radius: 2px;
    margin-right: 10px;
}

.collect .item-list .item .info{
    flex: 1;
    display: flex;
    flex-direction: column;
}

.collect .item-list .item .info .title{
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
}

.collect .item-list .item .info .time{
    font-size: 14px;
    color: #777;
}

/*页面*/
.pages{
    display: block;
    padding: 20px;
    background-color: #fff;
}

.pages .title{
    font-size: 22px;
    display: block;
    text-align: center;
    color: #000;
}

.pages .content{
    font-size: 16px;
    color: #222;
    text-align: justify;
    line-height: 1.5;
    padding: 20px 0;
}

.pages .content *{
    max-width: 100%;
}

.security{
    display: block;
    padding: 20px 10px;
}

.security .form-control{
    height: 45px;
    font-size: 16px;
    line-height: 1.5;
    padding: 0 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.security .btn{
    line-height: 1.6;
    font-size: 16px;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.kefu{
    display: block;
    padding: 30px 20px;
    background-color: #fff;
}

.kefu .logo{
    text-align: center;
    display: block;
}

.kefu .logo .image{
    width: 80px;
    height: 80px;
    border-radius: 10px;
    display: inline-block;
}

.kefu .shop-name{
    font-size: 18px;
    text-align: center;
    display: block;
    margin: 10px 0;
}

.kefu .tips{
    text-align: center;
    font-size: 16px;
    color: #666;
    display: block;
    margin-bottom: 50px;
}

.kefu .button{
    padding: 12px 0;
    display: block;
    background-color: #2FC361;
    color: #fff;
    text-align: center;
    font-size: 16px;
    border-radius: 10px;
}
